<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>安卓</title>
    <link rel="stylesheet" href="./static/css/index.css">
    <script src="./static/js/jquery.js"></script>
    <script src="./static/js/jquery.cookie.js"></script>
    <style>
        body {
            font-family: '思源黑体';
        }
    </style>
</head>

<body>
    <div class="topstatus">
        <div class="timer" contenteditable></div>
        <div class="right">
            <img src="./imgs/android_clock.png" alt="" srcset="" class="clock">
            <img src="./imgs/android_wifi.png" alt="" srcset="" class="wifi">
            <img src="./imgs/android_xinhao.png" alt="" srcset="" class="xinhao">
            <img src="./imgs/android_cell.png" alt="" srcset="" class="cell">
        </div>
    </div>
    <script>
        var obj = new Date();
        var hour = obj.getHours().toString();
        if (hour.length == 1) {
            hour = '0' + hour
        }
        var minute = obj.getMinutes().toString();
        if (minute.length == 1) {
            minute = '0' + minute
        }
        var timer = hour + ':' + minute;
        // console.log(timer)
        var timedom = document.getElementsByClassName('timer')[0]
        // console.log(timedom)
        timedom.innerText = timer
    </script>
    <div class="top_top">
        <img src="./imgs/left.png" alt="" srcset="" class="top_left">
        <div class="top_title" contenteditable>待发货</div>
    </div>

    <div id="main">
        <div class="HV_hI6em">
            <div class="_3O8DCHoi">
                <p class="_3G9ZM30X" contenteditable>预计支付成功后1天内发货，最晚今天内发货</p>
                <div class="_2hk4Lfs4"></div>
            </div>
            <div> </div>
            <div class="_3I-ylGLM">
                <div class="_1BQ1biBE">
                    <div class="_1H8JkAR0">
                        <div class="_281dGZiS">
                            <div class="SvvsuGb1"></div>
                        </div>
                        <div class="OrBVXoR_ _2Ro8ijrn">
                            <p class="_3wPsbQrS"><span class="_1Tk08e7g users" contenteditable>柯帆</span><span
                                    class="_3jo05ow3" contenteditable>13011111411</span>
                                <span class="_37oW57QQ" contenteditable>郑州市 金水区 民航路街道 盛润国际广场</span>
                            </p>
                        </div>
                        <div class="_20jYbBix" data-active="ghost-red"><a href="./address.html?id=1"
                                rel="noopener noreferrer">修改</a></div>
                        <div class="_2hk4Lfs4"></div>
                    </div>
                    <div class="_1H8JkAR0" style="min-height: 0.44rem;">
                        <div class="orderboxx">

                        </div>
                        <div class="OrBVXoR_">
                            <p class=""><span class="_1Tk08e7g" contenteditable
                                    style="color: #3FBE2F;">收货不便时，可选择代收服务</span>
                            </p>
                        </div>
                        <div class="right"></div>
                    </div>
                    <div class="_2hk4Lfs4"></div>
                </div>
            </div>
        </div>
        <div id="TYVaoW2I">
            <div class="checkgoods">
                <div class="checkbox">
                    <span>角标展示:</span>
                    <input type="checkbox" name="check1" class="checkbox check1" onclick="docheck(this)" />
                    <span>
                        <img class="_1L2dZi9U"
                            src="https://commimg.pddpic.com/oms_img_ng/2020-09-25/9debb8ea-ac27-4027-9e9f-6f4618599a96.png?imageView2/q/70/format/webp"
                            style="width:0.34rem" />
                    </span>
                    <input type="checkbox" name="check2" class="checkbox check2" onclick="docheck(this)" />
                    <span>
                        <img class="_1L2dZi9U"
                            src="https://t16img.yangkeduo.com/mms_static/2019-12-04/ea0eaa26-203d-487b-9d7e-9c920c0b8d51.gif"
                            style="width:0.58rem" />
                    </span>
                </div>
                <div style="display: flex;">
                    <input type="text" name="goodsurl" class="ipt" placeholder="请输入商品id或商品链接" />
                    <div class="btn" data-active="ghost-gray">查询</div>
                </div>
            </div>
        </div>
        <div class="_3I-ylGLM" style="margin-bottom: .08rem;">
            <div class="_1KrSggPG">
                <div class="pxq">
                    <img src="./imgs/pxq.png" alt="" srcset="">
                    <div class="pxq_t" contenteditable>来拼小圈,看看好友在买什么</div>
                </div>
                <div class="qAa3ONqz">
                    <div class="_2O2aPXb1"></div>
                </div>
            </div>
        </div>
        <div class="_3I-ylGLM" style="margin-bottom: .08rem;">
            <div class="_1KrSggPG">
                <div class="qAa3ONqz"><span class="_29d1KdgV" contenteditable>拼单成功</span></div>
                <div class="qAa3ONqz">
                    <ul class="_3NKSRmTk">
                        <div class="_2EO6Aczd">
                            <li class="_w4MZrKz"><img
                                    src="https://avatar2.pddpic.com/a/Q050MDhsMHhTNlRkdVJyS1VlRHdua1pJMWRvYmg4dFUyQT09djA0-1591796423?imageMogr2/thumbnail/100x"
                                    class="userimg1" />
                            </li>
                            <li class="_w4MZrKz"><img
                                    src="https://avatar2.pddpic.com/a/fe9b517a1d9a1e3ed44a6135a98ad71676c22f5b-1559375769?imageMogr2/thumbnail/100x"
                                    class="userimg2" />
                            </li>
                        </div>
                    </ul>
                    <div class="_2O2aPXb1"></div>
                </div>
            </div>
        </div>
        <ul class="_2lbZVM-p">
            <li>
                <div class="_3hXR6Znk" contenteditable>订单编号：</div>
                <div class="_2B-0MrIp" contenteditable><span>201012-097334071221657</span>
                    <div class="_3O0HGg4N" data-active="ghost-gray">复制</div>
                </div>
            </li>
            <li>
                <div class="_3hXR6Znk" contenteditable>支付方式：</div>
                <div class="_2B-0MrIp" contenteditable><span>微信支付</span></div>
            </li>
            <li>
                <div class="_3hXR6Znk" contenteditable>商品快照：</div>
                <div class="_2B-0MrIp" contenteditable><span>核对交易细节时，可作为判断依据</span>
                    <div class="_3O0HGg4N" data-active="ghost-gray">查看</div>
                </div>
            </li>
            <li>
                <div class="_3hXR6Znk" contenteditable>下单时间：</div>
                <div class="_2B-0MrIp" contenteditable><span>2020-10-12 09:53:03</span></div>
            </li>
            <li>
                <div class="_3hXR6Znk" contenteditable>拼单时间：</div>
                <div class="_2B-0MrIp" contenteditable><span>2020-10-12 09:55:02</span></div>
            </li>
        </ul>
        <div class="_3bH7VZOP"><a class="_1q_1xvQC" data-active="ghost-gray"><span contenteditable>催发货</span></a><a
                class="_1q_1xvQC" data-active="ghost-gray"><span contenteditable>再次购买</span></a><a class="_1q_1xvQC"
                data-active="ghost-gray"><span contenteditable>设为匿名</span></a></div>
    </div>
    <div class="botbox">
        <div class="navtop">
            <div class="topnav">
                <span class="nav_li active" contenteditable>精选</span>
                <span class="nav_li" contenteditable>抽纸</span>
                <span class="nav_li" contenteditable>卷纸</span>
                <span class="nav_li" contenteditable>洗漱用品</span>
                <span class="nav_li" contenteditable>浴室置物架</span>
                <span class="nav_li" contenteditable>拖把</span>
                <span class="nav_li" contenteditable>洗碗刷锅</span>
            </div>
        </div>
        <div class="goodsbox">
            <div class="goodsli">
                <div>
                    <img src="http://t00img.yangkeduo.com/goods/images/2020-08-06/5f16656e3e84c84b4163a98a31b44cac.jpeg"
                        alt="" srcset="" style="height: 1.86rem;width: 100%;background-size: contain;" class="userimg3">
                </div>
                <p
                    style="height: .37rem;line-height: 1.5;margin: .08rem;margin-bottom: 0;overflow: hidden;word-break: break-all;word-wrap: break-word;font-size: .13rem;color: #333;">
                    <span contenteditable>冰丝夏季透气男士帆布鞋韩版潮流百搭板鞋运动休闲布鞋学生鞋子男</span></p>
                <div
                    style="height: .35rem;margin: 0 .07rem;display: flex;justify-content: space-between;align-items: center;">
                    <strong style="color: #ee2e3a;font-weight: 700;font-size: .16rem;">
                        <strong style="font-size: .1rem;">￥</strong>
                        <span contenteditable>16.8</span>
                    </strong>
                    <div style="font-size: .13rem;color: #9c9c9c;"><span contenteditable>已拼1562件</span> </div>
                </div>
            </div>

            <div class="goodsli">
                <div>
                    <img src="http://t00img.yangkeduo.com/goods/images/2020-08-06/5f16656e3e84c84b4163a98a31b44cac.jpeg"
                        alt="" srcset="" style="height: 1.86rem;width: 100%;background-size: contain;" class="userimg4">
                </div>
                <p
                    style="height: .37rem;line-height: 1.5;margin: .08rem;margin-bottom: 0;overflow: hidden;word-break: break-all;word-wrap: break-word;font-size: .13rem;color: #333;">
                    <span contenteditable>冰丝夏季透气男士帆布鞋韩版潮流百搭板鞋运动休闲布鞋学生鞋子男</span></p>
                <div
                    style="height: .35rem;margin: 0 .07rem;display: flex;justify-content: space-between;align-items: center;">
                    <strong style="color: #ee2e3a;font-weight: 700;font-size: .16rem;">
                        <strong style="font-size: .1rem;">￥</strong>
                        <span contenteditable>16.8</span>
                    </strong>
                    <div style="font-size: .13rem;color: #9c9c9c;"><span contenteditable>已拼1562件</span> </div>
                </div>
            </div>

            <div class="goodsli">
                <div>
                    <img src="http://t00img.yangkeduo.com/goods/images/2020-08-06/5f16656e3e84c84b4163a98a31b44cac.jpeg"
                        alt="" srcset="" style="height: 1.86rem;width: 100%;background-size: contain;" class="userimg5">
                </div>
                <p
                    style="height: .37rem;line-height: 1.5;margin: .08rem;margin-bottom: 0;overflow: hidden;word-break: break-all;word-wrap: break-word;font-size: .13rem;color: #333;">
                    <span contenteditable>冰丝夏季透气男士帆布鞋韩版潮流百搭板鞋运动休闲布鞋学生鞋子男</span></p>
                <div
                    style="height: .35rem;margin: 0 .07rem;display: flex;justify-content: space-between;align-items: center;">
                    <strong style="color: #ee2e3a;font-weight: 700;font-size: .16rem;">
                        <strong style="font-size: .1rem;">￥</strong>
                        <span contenteditable>16.8</span>
                    </strong>
                    <div style="font-size: .13rem;color: #9c9c9c;"><span contenteditable>已拼1562件</span> </div>
                </div>
            </div>

            <div class="goodsli">
                <div>
                    <img src="http://t00img.yangkeduo.com/goods/images/2020-08-06/5f16656e3e84c84b4163a98a31b44cac.jpeg"
                        alt="" srcset="" style="height: 1.86rem;width: 100%;background-size: contain;" class="userimg6">
                </div>
                <p
                    style="height: .37rem;line-height: 1.5;margin: .08rem;margin-bottom: 0;overflow: hidden;word-break: break-all;word-wrap: break-word;font-size: .13rem;color: #333;">
                    <span contenteditable>冰丝夏季透气男士帆布鞋韩版潮流百搭板鞋运动休闲布鞋学生鞋子男</span></p>
                <div
                    style="height: .35rem;margin: 0 .07rem;display: flex;justify-content: space-between;align-items: center;">
                    <strong style="color: #ee2e3a;font-weight: 700;font-size: .16rem;">
                        <strong style="font-size: .1rem;">￥</strong>
                        <span contenteditable>16.8</span>
                    </strong>
                    <div style="font-size: .13rem;color: #9c9c9c;"><span contenteditable>已拼1562件</span> </div>
                </div>
            </div>

        </div>
    </div>
    <div class="_3rL8Gxq4"></div>
    <div>
        <form id="form_face" enctype="multipart/form-data" style="width:auto;">
            <input type="file" name="fileToUpload" id="fileToUpload" onchange="fileSelected();" style="display:none;">
        </form>
    </div>
    </div>
    <script>
        var getaddresslist = "http://app.letuilm.com/api/get_address_list"
        var getinfourl = "http://app.letuilm.com/api/get_pin_duo_goods"
        var checknum = []
        var imgupload = ""
        var goodsimg = ""
        var username = ""
        var id = ""
        var addresslist = []
        var obj = {
            shopimg: 'https://commimg.pddpic.com/pdd_ims/mainObject/v1/pub_20200408aff4edf1f19442a8abb03db2df23d993.jpg?imageView2/2/w/60/q/70/format/webp',
            shopname: '众悦家居生活',
            goodsimg: 'https://img.pddpic.com/goods/images/2019-11-09/edf4b7cc-1bda-4446-91c6-397ac7792805.jpg?imageView2/2/w/234/q/70/format/webp',
            goodsinfo: '垃圾袋黑色家用加厚厨房手提背心式一次性中号办公拉圾塑料袋批发',
            goodssku: '经济型32*52【较薄】,50个手提式',
            tips: '极速退款',
            goodsprice: '2.84',
            goodsnum: '1'
        }
        var btn = document.getElementsByClassName('btn')[0]
        var ipt = document.getElementsByClassName('ipt')[0]
        var checkgoods = document.getElementsByClassName('checkgoods')[0]
        var userimg1 = document.getElementsByClassName('userimg1')[0]
        var userimg2 = document.getElementsByClassName('userimg2')[0]
        var userimg3 = document.getElementsByClassName('userimg3')[0]
        var userimg4 = document.getElementsByClassName('userimg4')[0]
        var userimg5 = document.getElementsByClassName('userimg5')[0]
        var userimg6 = document.getElementsByClassName('userimg6')[0]
        var goodsinfo = document.getElementById('TYVaoW2I')
        var upload = document.getElementById('fileToUpload')
        if (geturl('id')) {
            id = geturl('id')
            username = $.cookie('username')
            console.log(id)
            console.log(username)
            getaddress()
        }
        function getaddress() {
            // console.log('userc',userc)
            $.ajax({
                url: getaddresslist,
                type: 'post',
                data: {
                    user: username,
                    // user: '',
                },
                // dataType: 'json',
                timeout: 3000,
                // contentType:"application/json",
                success: function (res) {
                    if (res.code == 200) {
                        // console.log('地址列表', res)
                        addresslist = res.data
                        console.log('addresslist', addresslist)
                        let str = ""
                        for (let i in addresslist) {
                            if (addresslist[i].id == id) {
                                console.log('00', addresslist[i])
                                str += addresslist[i].city + ' ' + addresslist[i].area + ' ' + addresslist[i].detail
                                $('.users').text(addresslist[i].consignee)
                                $('._3jo05ow3').text(addresslist[i].phone)
                                $('._37oW57QQ').text(str)
                            }
                        }
                    }
                },
                //异常处理
                error: function (err) {
                    console.log(err);
                }
            })
        }
        function geturl(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
        }
        function ajax(options) {
            options = options || {};  //调用函数时如果options没有指定，就给它赋值{},一个空的Object
            options.type = (options.type || "GET").toUpperCase();/// 请求格式GET、POST，默认为GET
            options.dataType = options.dataType || "json";    //响应数据格式，默认json

            var params = formatParams(options.data);//options.data请求的数据

            var xhr = new XMLHttpRequest();
            //启动并发送一个请求
            if (options.type == "GET") {
                xhr.open("GET", options.url + "?" + params, true);
                xhr.send(null);
            } else if (options.type == "POST") {
                xhr.open("post", options.url, true);

                //Content-type数据请求的格式
                xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                xhr.send(params);
            }

            //    设置有效时间
            setTimeout(function () {
                if (xhr.readySate != 4) {
                    xhr.abort();
                }
            }, options.timeout)

            //    接收
            //     options.success成功之后的回调函数  options.error失败后的回调函数
            //xhr.responseText,xhr.responseXML  获得字符串形式的响应数据或者XML形式的响应数据
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    var status = xhr.status;
                    if (status >= 200 && status < 300 || status == 304) {
                        options.success && options.success(xhr.responseText, xhr.responseXML);
                    } else {
                        options.error && options.error(status);
                    }
                }
            }
        };

        //格式化请求参数
        function formatParams(data) {
            var arr = [];
            for (var name in data) {
                arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]));
            }
            arr.push(("v=" + Math.random()).replace(".", ""));
            return arr.join("&");

        };
        function docheck(e) {
            // console.log(e.checked)
            if (e.checked == true) {
                if (e.name == 'check1') {
                    checknum.push(1)
                } else {
                    checknum.push(2)
                }
            } else {
                if (e.name == 'check1') {
                    let i = checknum.indexOf(1)
                    checknum.splice(i, 1)
                } else {
                    let i = checknum.indexOf(2)
                    checknum.splice(i, 1)
                }
            }
            // console.log(checknum)
        };
        function getUrl(urlstr, name) {
            // console.log('urlstr', urlstr,'name',name);
            let i = urlstr.indexOf('?');
            urlstr = urlstr.slice(i, urlstr.length); // ?id=xxxxx&a=xxx
            var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
            var r = urlstr.substr(1).match(reg);
            if (r != null) {
                return unescape(r[2]);
            } else {
                return null;
            }
            //使用 let id = this.getUrl(this.value,'id');//注意 id是string
        }
        btn.onclick = function () {
            console.log(ipt.value)
            let value = ipt.value.toString()
            let itemid = ""
            if (value.length > 12) {
                itemid = getUrl(value, 'goods_id')
            } else {
                itemid = value
            }
            ajax({
                url: getinfourl,
                type: 'get',
                data: {
                    goods_id: itemid,
                },
                dataType: 'json',
                timeout: 3000,
                // contentType:"application/json",
                success: function (res) {
                    console.log(res)
                    if (res.code == 200) {
                        obj.goodsinfo = res.data.goodsName
                        obj.shopname = res.data.mallName
                        obj.shopimg = res.data.shopLogo
                        obj.goodsimg = res.data.skus[0].thumbUrl
                        obj.goodssku = res.data.skus[0].specs[0].spec_value
                        obj.tips = res.data.skus[0].yellowLabel
                    }
                },
                //异常处理
                error: function (err) {
                    console.log(err);
                }
            })

            let str = `<div class="_1_awMaVG">
                <div class="VuORZ2Ld">
                    <div class="zZYYH7mE"><img class="shopimg"
                            src="` + obj.shopimg + `" />
                    </div>
                    <div>
                        <div class="_29NO4zn9"><span class="KJUFK0bf" style="max-width:2.04rem"
                                contenteditable>` + obj.shopname + `</span>`
            if (checknum.indexOf(1) !== -1) {
                str += `<img class="_1L2dZi9U"
                                src="https://commimg.pddpic.com/oms_img_ng/2020-09-25/9debb8ea-ac27-4027-9e9f-6f4618599a96.png?imageView2/q/70/format/webp"
                                style="width:0.34rem" />`
            }
            if (checknum.indexOf(2) !== -1) {
                str += `<img class="_1L2dZi9U"
                                src="https://t16img.yangkeduo.com/mms_static/2019-12-04/ea0eaa26-203d-487b-9d7e-9c920c0b8d51.gif"
                                style="width:0.58rem" />`
            }

            str += `</div></div></div></div>
            <div class="_1mEsRj_v">
                <div class="nUWcwDx3"> 
                    <div class="_2Siz_2h2">
                        <img class="_12-jOe04 goodsimg" src="` + obj.goodsimg + `" />
                    </div>
                    <div class="_1VbBOHGg">
                        <div class="fQQmrJMP">
                            <div class="_3F_Ya1M_">
                                <p contenteditable>` + obj.goodsinfo + `</p>
                                <p class="TpuY8Cae" contenteditable>` + obj.goodssku + `</p>
                            </div>
                            <div class="_3I2eOU0c">
                                <div class="_2XHek3-z _1vYxJCO6 _207jUowd"><span contenteditable>` + obj.tips + `</span></div>
                            </div>
                        </div>
                        <div class="_1KDcg5LJ">
                            <div class="_1z-6ukcC" contenteditable><i>￥</i>` + obj.goodsprice + `</div>
                            <div class="_5PXV7-6X" contenteditable>x
                                ` + obj.goodsnum + `</div>
                        </div>
                    </div>
                </div>
                <div>
                    <div class="j22hvRYc">
                        <div class="_1iJ5VLRf _1G1waNWk" data-active="ghost-red" contenteditable><a>申请退款</a></div>
                        <div class="_1iJ5VLRf" data-active="ghost-gray"><span class="_14Y6EwGj"
                                style="background-image:url(https://funimg.pddpic.com/2020-08-03/a2cdc9ca-81d6-496e-af31-de7e24b00279.png.slim.png);width:0.16rem;height:0.16rem"></span><a
                                contenteditable>联系客服</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="_39f0KNXl"><span class="_2n-xKqXh"></span>
                <div class="PxVqKfeO"><span class="" contenteditable>实付:</span><span class="_1VHxk9vl"
                        contenteditable><i>￥</i><span>` + obj.goodsprice + `</span></span><span class="_15F5BWdt"
                        contenteditable>(免运费)</span></div>
            </div>`
            // console.log('checkgoods', checkgoods)
            checkgoods.style.dispaly = 'none';
            // console.log('goodsinfo', goodsinfo)
            goodsinfo.innerHTML = str
            goodsimg = document.getElementsByClassName('goodsimg')[0]
            shopimg = document.getElementsByClassName('shopimg')[0]
            console.log(goodsimg)
            goodsimg.onclick = function () {
                imgupload = 3
                document.getElementById("fileToUpload").click();
            }
            shopimg.onclick = function () {
                imgupload = 8
                document.getElementById("fileToUpload").click();
            }

        };
        function fileSelected() {
            // 文件选择后触发次函数
            console.log('00--->', upload)
            var localFile = upload.files[0];
            var reader = new FileReader();
            var content;
            reader.onload = function (event) {
                console.log('event', event)
                content = event.target.result;
                // document.getElementById("img").src = content;
                switch (imgupload) {
                    case 1:
                        userimg1.src = content
                        break;
                    case 2:
                        userimg2.src = content
                        break;
                    case 3:
                        goodsimg.src = content
                        break;
                    case 4:
                        userimg3.src = content
                        break;
                    case 5:
                        userimg4.src = content
                        break;
                    case 6:
                        userimg5.src = content
                        break;
                    case 7:
                        userimg6.src = content
                        break;
                    case 8:
                        shopimg.src = content
                        break;
                    default:
                        break;
                }
            }
            reader.onerror = function (event) {
                alert('error')
                alert("File could not be read! Code " + event.target.error.code);
            }
            content = reader.readAsDataURL(localFile, "UTF-8");

        }
        userimg1.onclick = function () {
            imgupload = 1
            document.getElementById("fileToUpload").click();
        }
        userimg2.onclick = function () {
            imgupload = 2
            document.getElementById("fileToUpload").click();
        }
        userimg3.onclick = function () {
            imgupload = 4
            document.getElementById("fileToUpload").click();
        }
        userimg4.onclick = function () {
            imgupload = 5
            document.getElementById("fileToUpload").click();
        }
        userimg5.onclick = function () {
            imgupload = 6
            document.getElementById("fileToUpload").click();
        }
        userimg6.onclick = function () {
            imgupload = 7
            document.getElementById("fileToUpload").click();
        }
    </script>
</body>

</html>